<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:zanata="http://java.sun.com/jsf/composite/zanata"
  xmlns:a4j="http://richfaces.org/a4j">

<ui:composition template="../WEB-INF/template/template.xhtml">
  <f:metadata>
    <f:viewParam name="role" value="#{zanataRoleAction.role}" />
    <f:event type="preRenderView" listener="#{zanataRoleAction.loadRole}"/>
    <f:event type="preRenderView" listener="#{identity.checkRole('admin')}"/>
  </f:metadata>

  <ui:define name="head">
    <style type="text/css">
      .groups label {
        padding-left: 0.40625em;
      }
    </style>
  </ui:define>

  <ui:define
    name="page_title">#{zanataRoleAction.role} - #{msgs['jsf.RoleDetails']}</ui:define>
  <ui:define name="center_content">
    <div class="g--centered">
      <div class="g__item w--1-3-m w--3-8-l w--1-3 l--push-bottom-1">
        <p class="txt--meta l--push-all-0">
          <a href="/admin/home">
            #{msgs['jsf.Administration']}
          </a>
          <i class="i i--arrow-right"></i>
          <h:link outcome="/admin/rolemanager.xhtml">
            #{msgs['jsf.ManageRoles']}
          </h:link>
        </p>

        <h1 class="l--push-all-0">#{msgs['jsf.RoleDetails']}</h1>

        <h:form id="roleForm">
          <div class="form__item l--push-top-1">
            <h:outputLabel for="role">#{msgs['jsf.Role']}</h:outputLabel>
            <zanata:decorate id="role" componentId="roleField">
              <h:inputText id="role" value="#{zanataRoleAction.role}"
                readonly="#{identityManager.roleExists(zanataRoleAction.role)}"
                required="true" maxlength="255"
                valueChangeListener="#{zanataRoleAction.validateRoleName}">
                <a4j:ajax event="blur" render="roleField" execute="@this" bypassUpdates="true"/>
              </h:inputText>
            </zanata:decorate>
          </div>

          <div class="form__item l--push-top-1">
            <h:outputLabel>#{msgs['jsf.MemberOf']}</h:outputLabel>
            <zanata:decorate id="groups" componentId="groupsField">
              <h:selectManyCheckbox id="groups" value="#{zanataRoleAction.groups}"
                layout="pageDirection" styleClass="groups">
                <f:selectItems value="#{identityManager.listRoles()}" var="role"
                  itemLabel="#{role}"/>
              </h:selectManyCheckbox>
            </zanata:decorate>
          </div>

          <h:commandButton value="#{msgs['jsf.Save']}" id="roleDetailSave"
            action="#{zanataRoleAction.save}" styleClass="button button--primary"/>

          <h:button id="cancel" styleClass="button button--link l--push-left-half"
            value="#{msgs['jsf.Cancel']}"
            outcome="/admin/rolemanager.xhtml"/>
        </h:form>
      </div>
    </div>
  </ui:define>

</ui:composition>
</html>
